@include b('org-recursive-tree-node') {
    display: flex;
    flex-direction: column;
    justify-content: center;
    width: 100%;

    @include e('header') {
        display: flex;
        flex-direction: column;
        justify-content: center;
    }

    @include e('separator-container') {
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 3px;
        margin: 25px 0;
    }

    @include e('separator') {
        position: relative;
        display: flex;
        width: 100%;
        padding-bottom: 24px;
        margin-top: 10px;

        @include m('line-part') {
            width: 30%;
            margin: 0 10%;
            border-top: 2px solid getCssVar(color, tertiary, light, active);

            &::before,
            &::after {
                position: absolute;
                display: block;
                height: 12px;
                content: "";
            }

            @include when('line-left') {
                &::before {
                    width: calc(10% + 1px);
                    margin-top: -2px;
                    margin-left: calc(-10% + 1px);
                    border-top: 2px solid getCssVar(color, tertiary, light, active);
                    border-left: 2px solid getCssVar(color, tertiary, light, active);
                    border-top-left-radius: 8px;
                }

                &::after {
                    width: calc(10% + 1px);
                    margin-top: -14px;
                    margin-left: 30%;
                    border-right: 2px solid getCssVar(color, tertiary, light, active);
                    border-bottom: 2px solid getCssVar(color, tertiary, light, active);
                    border-bottom-right-radius: 6px;
                }
            }

            @include when('line-right') {
                &::before {
                    width: calc(10% + 1px);
                    margin-top: -14px;
                    margin-left: calc(-10% + 1px);
                    border-bottom: 2px solid getCssVar(color, tertiary, light, active);
                    border-left: 2px solid getCssVar(color, tertiary, light, active);
                    border-bottom-left-radius: 6px;
                }

                &::after {
                    width: calc(10% + 1px);
                    margin-top: -2px;
                    margin-left: 30%;
                    border-top: 2px solid getCssVar(color, tertiary,light, active);
                    border-right: 2px solid getCssVar(color, tertiary,light, active);
                    border-top-right-radius: 8px;
                }
            }
        }
    }

    @include e('active-content') {
        display: flex;
        align-items: center;
        justify-content: center;
        margin-top: 25px;

        &>div {
            width: auto;
        }
    }
}